<!DOCTYPE html>
<html>
<head>
  <title>AngularJS Tutorials</title>
  <link rel="stylesheet" href="foundation.min.css">
</head>
<body>
<!--div ng-app="">
  basic test:
  <h1>.....this test</h1>
  <h1>{{2 + 2}}</h1>
  <h1>{{"john" + "ppanything"}}</h1>

  <input type="text" ng-model="data1.message">
  <h1>{{data1.message}}</h1>

  input things:
  <div ng-controller="FirstCtrl">
    <h1>{{data1.message + " world"}}</h1> 
    <div class="{{data1.message}}">
      Wrap me with a foundation component
    </div>
  </div>
  <div ng-controller="SecondCtrl">
    <input type="text" ng-model="message">
    <h1>{{message + " world2"}}</h1>
  </div>
</div-->

share controllers:
<!--div ng-app="myApp">
  <input type="text" ng-model="data.message">
  <h1>{{data2.message}}</h1>
  <div ng-controller="FirstCtrl">
    <input type="text" ng-model="data.message">
    <h1>{{data.message}}</h1>
  </div>
  <div ng-controller="SecondCtrl">
    <input type="text" ng-model="data.message">
    <h1>{{data.message}}</h1>
    Reverse func:<h1>{{reversedMessage()}}</h1>
    Filter:<h1>{{data.message|reverse}}</h1>
  </div>
</div>

avengers json:
<div ng-app="myApp1">
  <div ng-controller="AvengersCtrl">
    <table>
      <input type="text" ng-model="search.$">
      <tr ng-repeat="actor in avengers.cast|filter:search|orderBy:'-name'|limitTo:-5">
        <td>{{actor.name|lowercase}}</td>
        <td>{{actor.character|uppercase}}</td>
      </tr>      
    </table>
  </div>
</div-->

superhero:
<!--div ng-app="superhero">
  <div superman flash></div>
  <div enter>I'm content!</div>
</div>

<div ng-app="twitterApp">
  <div ng-controller="AppCtrl">
    <div enter="deleteTweets()">Roll over to load more tweets</div>
  </div>
</div>

<div ng-app="superApp">
  <superhero flight speed strength>Superman</superhero>
  <superhero speed>The Flash</superhero>
  <superhero strength>The Hulk</superhero>
</div>

<div ng-app="choreApp">
  <div ng-controller="ChoreCtrl">
    <kid done="logChore()"></kid>
  </div>
</div>

<div ng-app="drinkApp">
  <div ng-controller="AppCtrl">
    Ctrl
    <input type="text" ng-model="ctrlFlavor">
    Dir
    <div drink flavor="{{ctrlFlavor}}"></div>
  </div>
</div>

<div ng-app="phoneApp">
  <div ng-controller="AppCtrl">
    <div phone dial="callHome(message)"></div>
    <div phone dial="callHome(message)"></div>
    <div phone dial="callHome(message)"></div>
  </div>
</div>

<div ng-app="phoneApp">
<div ng-controller="AppCtrl">
  <phone number="555-1234" network="network" make-call="leaveVoicemail(number,message)"></phone>
  <phone number="867-5309" network="network" make-call="leaveVoicemail(number,message)"></phone>
  <phone number="911" network="network" make-call="leaveVoicemail(number,message)"></phone>
</div>
</div>

<div ng-app="phoneApp">
  <div ng-controller="AppCtrl">
    <panel>
      <div class="button">Click me!</div>
    </panel>
  </div>
</div>

<div ng-app="phoneApp">
  <div ng-controller="AppCtrl">
    <div class="button" ng-click="sayHi()">Click me!</div>
  </div>
</div>

<div ng-app="app">
  <input type="text" ng-model="model.title">
  <input type="text" ng-model="model.content">

  <zippy title="{{model.title}}">
    the content is: {{model.content}}
  </zippy>
</div>

<div ng-app="app">
  <dumb-password></dumb-password>
</div>

<div ng-app="app">
  <div ng-controller="MyCtrl">
    <div my-directive></div>
  </div>
</div>

<div ng-app="app">
  <script type="text/ng-template" id="zippy.html">
   When filledin a single file,the script is not needed
   script should be inside the ng-app,or be a html file:
    <div><h3 ng-click="toggleContent()">{{title}}</h3>
         <div ng-show="isContentVisible" ng-transclude></div>
    </div>
  </script>
    <input type="text" ng-model="model.title">
    <input type="text" ng-model="model.content">
  <zippy title="{{model.title}}">
    The content is : {{model.content}}
  </zippy>

</div-->

<div ng-app="app">
  <ng-view></ng-view>
</div>


<script type="text/javascript" src="/blog/view/angularjs/angular.js"></script>
<script type="text/javascript" src="main.js"></script>
</body>
</html>
